<template>
    <div>

        <Form ref="EditForm" :model="formData" label-position="right" :label-width="150">
            <Divider  >电脑端PC端第三方代码（一般用于放置百度商桥代码、站长统计代码、谷歌翻译代码等）</Divider>
            <Row :gutter="16">

                <Col :xs="24" :md="24">
                    <FormItem label="顶部代码" prop="pcTop" :rules="{required: false, message:'不能为空', trigger: 'blur'}">
                        <Input type="textarea" :autosize="{minRows: 5,maxRows: 10}"  v-model="formData.pcTop"></Input>
                        <div style="color:#c0c0c0">代码会放在 &lt;/head&gt; 标签以上。前端变量名为：cms.scriptCode.pcTop</div>
                    </FormItem>
                </Col>

                <Col :xs="24" :md="24">
                    <FormItem label="底部代码" prop="pcBottom" :rules="{required: false, message:'不能为空', trigger: 'blur'}">
                        <Input type="textarea" :autosize="{minRows: 5,maxRows: 10}"  v-model="formData.pcBottom"></Input>
                        <div style="color:#c0c0c0">代码会放在 &lt;/body&gt; 标签以上。前端变量名为：cms.scriptCode.pcBottom</div>
                    </FormItem>
                </Col>
                <Divider  >移动端第三方代码</Divider>

                <Col :xs="24" :md="24">
                    <FormItem label="顶部代码" prop="mobileTop" :rules="{required: false, message:'不能为空', trigger: 'blur'}">
                        <Input type="textarea" :autosize="{minRows: 5,maxRows: 10}"  v-model="formData.mobileTop"></Input>
                        <div style="color:#c0c0c0">代码会放在 &lt;/head&gt; 标签以上。前端变量名为：cms.scriptCode.mobileTop</div>
                    </FormItem>
                </Col>

                <Col :xs="24" :md="24">
                    <FormItem label="底部代码" prop="mobileBottom" :rules="{required: false, message:'不能为空', trigger: 'blur'}">
                        <Input type="textarea" :autosize="{minRows: 5,maxRows: 10}"  v-model="formData.mobileBottom"></Input>
                        <div style="color:#c0c0c0">代码会放在 &lt;/body&gt; 标签以上。前端变量名为：cms.scriptCode.mobileBottom</div>
                    </FormItem>
                </Col>



            </Row>
            <Row>
                <Col>
                    <FormItem>
                        <Button type="primary" @click="handleSubmit()">提交</Button>
                        <Button @click="handleReset()" style="margin-left: 8px">重置</Button>
                    </FormItem>
                </Col>
            </Row>


        </Form>


    </div>
</template>

<script>

    import AppFrame from '../../../libs/app-frame';
    import FileSelect from '../../../components/file-select';
    export default {
        components:{
            FileSelect
        },
        data: function() {
            return {
                state: { //数据加载状态
                    isLoadingData: false,
                    isChangeData: false
                },

                formData: {

                },
                query: {}
            }
        },
        created: function() {
            this.query = this.$route.query;
            this.getFormData();
        },
        methods: {
            getFormData() {
                let self = this;
                self.state.isLoadingData = true;
                let postData = {
                    label: '_script-code',
                };
                AppFrame.Http.Post("/manage-api/cms/setting/getInfo", postData).then(function(Ret) {
                    if (Ret.Result === 1 && Ret.Data) {
                        self.formData=Ret.Data;
                    }
                }).catch(function(err) {
                    this.$Message.error(JSON.stringify(err));
                });
            },
            handleSubmit() {
                let self = this;
                this.$refs["EditForm"].validate((valid) => {

                    if (valid) {
                        let postData={
                            label:'_script-code',
                            model:JSON.stringify(self.formData)
                        };

                        AppFrame.Http.Post("/manage-api/cms/setting/setInfo", postData, function(err, ret) {
                            if (ret && ret.Result === 1) {
                                self.$Message.success('保存成功');

                            } else {
                                self.$Message.error(ret.Msg);
                            }
                        })
                    }
                });
            },
            handleReset() {
                this.$refs["EditForm"].resetFields();
            },
        }
    }
</script>

<style scoped>

</style>
